import {useState, useEffect} from 'react'
import {useNavigate, useLocation} from 'react-router-dom'
import { NavBar } from 'antd-mobile'
import './style.less'

const HeaderTile = () => {
    const [arrow, setArrow] = useState(false)
    const navigate = useNavigate()
    const location = useLocation()
    const {pathname} = location
    const path = pathname === '/search'
    useEffect(()=>{
        arrowFlag()
    })

    const navTitle = !path ? 'lativ 诚衣' : '返回'
    const handleBack= value => {
        value && !path ? navigate('/') : navigate(-1)
    }
    const arrowFlag = () => {
        path ? setArrow(true) : setArrow(false)
    }
    return (
        <div className="header-title">
            <NavBar back={navTitle} onBack={handleBack} backArrow={arrow}></NavBar>
        </div>
    )
}

export default HeaderTile